import { Component, OnInit, ElementRef, ViewChild } from '@angular/core';
import { PushmsgbpdtlService, PushMsgBPDtl } from 'src/app/service/pushmsgbpdtl.service';
import { ActivatedRoute } from '@angular/router';


// PushMsgBPDetail - 白坯推送消息的明细页面
@Component({
  selector: 'app-pushmsgbpdtl',
  templateUrl: './pushmsgbpdtl.component.html',
  styleUrls: ['./pushmsgbpdtl.component.css']
})
export class PushmsgbpdtlComponent implements OnInit {

  tableData:PushMsgBPDtl[] = [];
  mill:string;billCode:string;clientSid:string;


  rotateDivLeftVal:number = 380;
  rotateDivLeft:string = this.rotateDivLeftVal + 'px';

  // 汇总的匹数、公斤
  agg_pair:number = 0;
  agg_kilo:number = 0;
  agg_meter:number = 0;

  @ViewChild('rotateDiv',{ static:false })
  ctlRotateDiv:ElementRef;

  @ViewChild('container',{ static:false })
  ctlContainer:ElementRef;

  noDataTip:string = '';

  constructor(
    private service:PushmsgbpdtlService,
    private route:ActivatedRoute
  ) { 
    this.getTableData();
  }

  ngOnInit() {
  }


  ngAfterViewInit(): void {
    
    setTimeout(() => {
      const tableHeight = this.ctlRotateDiv.nativeElement.clientHeight + 50;
      const bodyWidth = document.body.clientWidth;
      // 如果表格高度小于手机屏幕宽度，那么按照屏幕宽度移动
      // 相反则按照表格高度移动
      const left = tableHeight < bodyWidth ? bodyWidth:tableHeight;

      this.rotateDivLeftVal = left;
      this.rotateDivLeft = this.rotateDivLeftVal + 'px';
      setTimeout(() => {
        this.ctlContainer.nativeElement.scrollLeft = left;
      }, 200);
    }, 200);

  }

  setNoDataTip(){
    this.noDataTip = '由于超出时效期，本单据明细数据不可再查看！';
  }

  initPathParam(){
    this.mill = this.route.snapshot.queryParams["mill"];
    this.billCode = this.route.snapshot.queryParams["billCode"];
    this.clientSid = this.route.snapshot.queryParams["clientSid"];
  }

  getTableData(){
    this.initPathParam();// 初始化路径参数
    this.service.getDetail(this.mill,this.billCode,this.clientSid).subscribe(
      ( res:PushMsgBPDtl[] ) =>{
        if ( res.length <=0 ){
          console.log('获取到了空数组！');
          this.setNoDataTip();
          return
        }
        
        this.tableData = res;
        this.aggregate(res);// 汇总

      },error => {
        console.log('获取白坯入库单据明细数据时出错！');
        this.setNoDataTip();
      }
    )
  }

  aggregate(array:PushMsgBPDtl[]){// 获取数据后计算汇总数据
    if( array.length <=0 ){
      console.log('是空数组！');
      return
    }

    this.agg_pair = 0;
    this.agg_kilo = 0;
    this.agg_meter = 0;
    let temp:number = 0;
    array.forEach(ele => {
      temp = ele.pairs === undefined?0:ele.pairs;
      temp = ele.pairs === null?0:ele.pairs;
      this.agg_pair = this.agg_pair + temp;

      temp = ele.kilo === undefined?0:ele.kilo;
      temp = ele.kilo === null?0:ele.kilo;
      this.agg_kilo = this.agg_kilo + temp;

      temp = ele.meter === undefined?0:ele.meter;
      temp = ele.meter === null?0:ele.meter;
      this.agg_meter = this.agg_meter + temp;
    });
  }


  // 判断是偶数则返回true，从而使表格偶数行变色
  isEven(rowIndex:number){
    if( rowIndex %2 === 0 )
      return false;
    else
      return true;
  }


}
